<template lang="pug">
el-dialog(
  custom-class="material-modal"
  :visible.sync="show"
  width="560px"
  @open="beforeOpen"
  :before-close="close"
  :close-on-click-modal="false"
)
  .modal-title.border-bottom(slot="title") 审核拒绝
  .modal-content
    .modal-content-title 请填写拒绝原因
    el-input(placeholder="请填写拒绝原因" v-model="rejectReason" type="textarea" maxlength="200" show-word-limit rows="10" resize="none")
  .modal-footer(slot="footer")
    el-button(size="small" @click="close") 取消
    el-button(size="small" type="primary" @click="confirm") 确定
</template>

<script>
export default {
  name: 'refuseSupplierDialog',
  props: {
    show: Boolean
  },
  data () {
    return {
      rejectReason: ''
    }
  },
  methods: {
    beforeOpen () {
      this.rejectReason = ''
    },
    confirm () {
      this.$emit('confirm', this.rejectReason)
    },
    close () {
      this.$emit('close')
    }
  }
}
</script>

<style type="text/css" lang="scss">
.material-modal {
  .el-dialog__header {
    border-bottom: 1px solid #EDEDED;
  }
}
</style>

<style lang="scss" scoped>
.modal-content-title {
  font-size: 14px;
  line-height: 22px;
  color: #3E4373;
  margin-bottom: 8px;
}
</style>